<template>
	<view>
	<view class="head dixian">
		<text class="color" @click="back">返回</text>
		<text>计量设备更换</text>
		<text class="color" @click="add">新增</text>
	</view>
	<view class="ipt dixian">
<uni-easyinput class="uni-mt-5" suffixIcon="search" v-model="data.ipt" placeholder="请输入水表号" @iconClick="check" @focus='huoqu' :inputBorder="false"></uni-easyinput>
	</view>
	<view class="content dixian" v-for="(item,index) in data.shujudata" :key="index">
		<view class="content_item">
			<text>单位名称</text>
			<text>{{item.dwname}}</text>
		</view>
		<view class="content_item">
			<text>更换水表号</text>
			<text>{{item.sbid}}</text>
		</view>
		<view class="content_item">
			<text>更换时间</text>
			<text>{{item.ghtime}}</text>
			
		</view>
	</view>
</view>
	</template>

<script>
	import { ref,onMounted,reactive} from 'vue';
	import {useStore} from "vuex"
	import http from '../../utils/http.js'
	export default {
	setup() {
		let data=reactive({
			shujudata:[],
			ipt:''
		})
		  let back=()=>{
			 uni.navigateTo({
			 	url:'./check'
			 }) 
		  }  
		  //增加
	   let add=()=>{
		   uni.navigateTo({
		   	url:'./jiliangadd'
		   })
	   }
	   let getdata=()=>{
		 http({
		 			   url:'/jiliang/jiliangdate',
		 			   method:'post'
		 }).then((res)=>{
		 			   if(res.data.data.length>0){
		 				   let shuju=res.data.data
		 				   for(let i=0;i<shuju.length;i++){
		 				   				   shuju[i].ghtime=shuju[i].ghtime.substring(0,10)
		 				   }
		 				   data.shujudata=shuju
		 				   
		 			   }
		 })  
	   }
	   let check=()=>{
		   console.log(data.ipt)
		   let shuju=[]
		   for(let i=0;i<data.shujudata.length;i++){
			   if(data.ipt==data.shujudata[i].sbid){
				   shuju.push(data.shujudata[i])
			   }
		   }
		   data.shujudata=shuju
	   }
	   let huoqu=()=>{
		   getdata()
	   }
	   onMounted(() => {
	      getdata()
	        })
	   return{
		   add,
		   back,
		   data,
		   check,
		   getdata,
		   huoqu
		}
	  }
	  		}

</script>

<style lang="less">
.head{
	display: flex;
	justify-content: space-around;
	padding: 20rpx 0;
}
.color{
	color:#57A7FE;
}
.dixian{
	border-bottom: 1rpx solid #898989;
}
.ipt{
	padding: 10rpx 0;
	input{
		padding-left: 45rpx;
		text-indent:15rpx;
		border: 1rpx solid #898989;
		border-radius: 40rpx;
		height: 80rpx;
		line-height: 80rpx;
	}
}
.content{
	display: flex;
	flex-direction: column;
	padding: 30rpx 35rpx;
	
}
.content_item{
	display: flex;
	
	text:first-child{
		color:#666666 ;
		flex: 1;
		font-weight:bold;
	}
		text:last-child{
			color:#898989 ;
			flex: 2;
	}
	}
</style>
